<template>
  <div class="child">
    <h1>mitt的ChildTwo组件</h1>
    <h2>Two要收到One传来的数据，先要在Two上绑定（监听）一个事件，然后One只要一调用，Two就能拿到数据</h2>
    <h1 v-if="toy">ChildOne发来的玩具:{{ toy }}</h1>
    
  </div>
</template>

<script lang="ts" setup>
    import { onUnmounted,ref } from 'vue';
    const toy = ref('')
    import emitter from '@/utils/emitter';

    // 给emitter绑定send-toy事件,这里的事件是监听send-toy事件，
    // 所以当ChildOne调用send-toy事件时，这里的value就会被赋值
    emitter.on('send-toy',(value:any)=>{
      toy.value = value
    })
    // 在组件卸载时解绑send-toy事件
    onUnmounted(()=>{
      emitter.off('send-toy')
	})

</script>

<style scoped>
</style>